<template>
	<view>
		<!-- <view class="imgEmpty" v-show="!loaded">
	    <image :src="env.FileUrl+'foood/ico/images/home_def01.png'" style="widdth:100%;height: 100%;" mode=""></image>
	  </view> -->
		<view v-show="loaded">
			<mtitles bgColor="none">
				<template v-slot:right>
					<view class="reflash_ico point" v-if="!noScrBot" @click.stop="reflafhMap">
						<image src="https://cdn-static.yekjx.com/food/ico/images/map_ico06.png" class="reflash_Ims">
						</image>
					</view>
				</template>
			</mtitles>
			<view v-show="!noScrBot||isMoving" class="p_rlt" style="z-index:3">
				<map id="bgMap" :longitude="state.mapLongitude" :latitude="state.mapLatitude" :scale="state.scale"
					:markers="state.covers" @callouttap="toDelsSta">
					<!-- <cover-view slot="callout">
            <cover-view v-for="(item,index) in state.covers" :key="index" class="customCallout" :marker-id="item.id">
              <cover-view class="callNames d_ib">&nbsp;{{item.contName}}&nbsp;&nbsp;</cover-view>
              <cover-image src="https://cdn-static.yekjx.com/food/images/map_ico01.png" class="coverImgs"></cover-image>
            </cover-view>
          </cover-view> -->
				</map>
			</view>
			<view class="bgFix" :class="{scrt:!noScrBot||isMoving}"></view>
			<!-- initTop:540\80 -->
			<slideContent initTop="80" :disable="allowSlide" minTop="300" maxTop="80" @change="changeSlide"
				@moving="slideAct" ref="sildContRef">
				<template v-slot:contents>
					<scroll-view style="height: 100vh;" :scroll-y="noScrBot" @click.stop="closeFn"
						:scroll-top="scrollTop">
						<view class="scrbg" :class="{bg:!noScrBot||isMoving}">
						</view>
						<view v-if="orderDetials.vstatus" class="order-details p_rlt">
							<!-- 时间 -->
							<view class="order-details-title" v-if="statusMap[orderDetials.vstatus]"
								@click.stop="toDelsSta">
								<text class="left-color">
									{{ statusMap[orderDetials.vstatus].text }}
									<text class="color-red"
										v-if="statusMap[orderDetials.vstatus].time">{{ statusMap[orderDetials.vstatus].time}}</text>
									<text v-if="orderDetials.vstatus=='206'||orderDetials.vstatus=='1139'">秒</text>
								</text>
								<text class="lg text-gray cuIcon-right cuIcon-right-size"></text>
							</view>
							<view class="order-details-tips"
								v-if="orderDetials.vstatus == '1139'&&orderDetials.vtype=='798'">
								<text class="fcon-shengyinkai"></text>
								<text
									class="margin-left-sm">若商家{{orderDetials.unAcceptedCancelTime}}分钟内未接单，订单将自动取消</text>
							</view>
							<view class="order-details-tips"
								v-if="(orderDetials.vstatus == '1140'||orderDetials.vstatus == '819')&&orderDetials.vtype=='568'">
								<text class="fcon-shengyinkai"></text>
								<text
									class="margin-left-sm">请您最晚在{{ orderDetials.selfPickTimes}}前凭取餐号或预留手机号后4位取餐，如有问题请提前联系商家。</text>
							</view>
							<!-- 联系商家1145 -->
							<view class="order-details-con con">
								<!-- 外卖 -->
								<block v-if="orderDetials.vtype=='798'&& orderDetials.vtype_two=='919'">
									<view class="order-details-conT"
										v-if="orderDetials.vstatus =='1139'||orderDetials.vstatus =='1140'||orderDetials.vstatus =='1142'||orderDetials.vstatus =='1143'">
										预计<text class="color-red">{{ deliveryTime }}</text>
										<text>送达</text>
									</view>
								</block>
								<!-- 预定 -->
								<block v-if="orderDetials.vtype=='798'&& orderDetials.vtype_two=='920'">
									<block v-if="orderDetials.vstatus =='1139'">
										<view class="yd_titles">预定时间</view>
										<view class="yd_times_text">{{orderDetials.selfPickTimes}}</view>
									</block>
									<view class="order-details-conT"
										v-if="orderDetials.vstatus =='1140'||orderDetials.vstatus =='1142'||orderDetials.vstatus =='1143'">
										预计<text class="color-red">{{ deliveryTime }}</text>
										<text>送达</text>
									</view>
								</block>
								<!-- 自提 -->
								<block v-if="orderDetials.vtype=='568'">
									<view v-if="orderDetials.vstatus=='206'||orderDetials.vstatus=='1139'">
										自取时间：{{orderDetials.selfPickTimes}}
									</view>
									<view
										v-if="orderDetials.vstatus=='819'||orderDetials.vstatus=='1144'||orderDetials.vstatus=='1140'||orderDetials.vstatus=='61'">
										<view class="getMen_text">取餐号</view>
										<view class="genMen_nums">{{orderDetials.vcode}}</view>
										<view class="genMen_times">自取时间：{{orderDetials.selfPickTimes}}</view>
									</view>
								</block>
								<view class="order-details-conT"
									v-if="orderDetials.vstatus == '61' || orderDetials.vstatus == '297'">
									<text>感谢您对炖大侠的信任，期待再次光临。</text>
								</view>
								<view class="order-details-conT" v-if="orderDetials.vstatus == '310'">
									<text>支付金额已退回原账户，期待再次光临</text>
								</view>
								<view class="order-details-conT" v-if="orderDetials.vstatus == '225'">
									<text>支付未成功，订单已取消，期待再次光临。</text>
								</view>
								<view class="order-details-conT"
									v-if="orderDetials.vstatus == '223'|| orderDetials.vstatus == '224'">
									<text>支付金额将退回原账户，请耐心等待</text>
								</view>
								<view class="order-details-conT flex justify-between"
									v-if="orderDetials.vstatus == '987'">
									<text>套餐服务截止：{{orderDetials.sxpEndtime || ''}}</text>
									<text class="point text_greens"
										v-if="orderDetials.sxpDdx?.service_status=='5' && orderDetials.sxpDdx?.total_balance_money<=0"
										@click.stop="toRech">我要充值</text>
									<!-- <text class="point text_greens" v-if="orderDetials.sxpDdx?.service_status=='6' && orderDetials.sxpDdx?.total_balance_money>0" @click.stop="dpBackMoney">申请退款</text> -->
								</view>
								<view class="order-details-conT flex justify-between"
									v-if="orderDetials.vstatus == 'serveStop'">
									<text>套餐服务已截止：{{orderDetials.sxpEndtime || ''}}</text>
									<text class="point text_greens" @click.stop="dpBackMoney">申请退款</text>
								</view>
								<view class="order-d-yd"
									v-if="(orderDetials.vstatus =='206'||orderDetials.vstatus =='1139'||orderDetials.vstatus =='1140'||orderDetials.vstatus =='1142'||orderDetials.vstatus =='1143')&&orderDetials.vtype=='798'">
									{{ bookingTime }}
								</view>
								<view class="order-details-business">
									<view class="order-details-businessFlex"
										v-if="orderDetials.vstatus =='206'&&orderDetials.vtype_two=='1185'">
										<text class="fcon-bianji fcon-style"></text>
										<text class="fcon-size">修改订餐时间/地址</text>
									</view>
									<view class="order-details-businessFlex" @click="callCust"
										v-if="orderDetials.vstatus!='987'">
										<text class="fcon-lianxishangjia fcon-style"></text>
										<text class="fcon-size">联系商家</text>
									</view>
									<!-- <view class="order-details-businessFlex" v-if="orderDetials.vstatus == '206' || orderDetials.vstatus =='58'" @tap="opneTiemProp">
									<text class="fcon-fankui fcon-style" :style="{ color : orderDetials.vstatus =='58' ? '#C0C0C0' : '#333' }"></text>
									<text class="fcon-size" :style="{ color : orderDetials.vstatus =='58' ? '#C0C0C0' : '#333' }">修改订单</text>
								</view> -->
									<view class="order-details-businessFlex"
										@click.stop="mnavTo('/pages/user/evaluate/evaluate?vbill_id='+ orderDetials.vbill_id)"
										v-if="(orderDetials.vstatus == '61'&& orderDetials.vtype=='798') || orderDetials.vstatus=='serveStop'">
										<text class="fcon-fankui fcon-style"></text>
										<text class="fcon-size">我要评论</text>
									</view>
									<view class="order-details-businessFlex"
										v-if="(orderDetials.vstatus == '1142'||orderDetials.vstatus == '1143'||orderDetials.vstatus == '1144')&&orderDetials.vtype=='798'">
										<text class="fcon-zhidianqishou1 fcon-style"></text>
										<text class="fcon-size">致电骑手</text>
									</view>
									<view class="order-details-businessFlex" @click.stop="gotoMap"
										v-if="(orderDetials.vstatus == '206'||orderDetials.vstatus == '819'||orderDetials.vstatus == '1139'||orderDetials.vstatus == '1140') && orderDetials.vtype=='568'">
										<text class="fcon-a-localico fcon-style"></text>
										<text class="fcon-size">取餐地址</text>
									</view>

									<block v-if="orderDetials.vstatus=='987'">
										<view class="order-details-businessFlex" @click.stop="editAutoMeals">
											<text class="fcon-bianji fcon-style"></text>
											<text class="fcon-size">修改订餐时间/地址</text>
										</view>
										<view class="order-details-businessFlex"
											@click.stop="goSobotUrl('https://yek-ddx.soboten.com/chat/h5/v6/index.html','69b4825bbba8408b883962c570a6287f')">
											<text class="fcon-my-08 fcon-style"></text>
											<text class="fcon-size">联系客服</text>
										</view>
									</block>
								</view>
							</view>
							<!-- <view class="order-details-con con" v-else>
							<view class="yd_titles">预定时间</view>
							<view class="yd_times_text">7月25日 11:40</view>
							<view class="order-details-businessFlex" @click="callCust">
								<text class="fcon-lianxishangjia fcon-style"></text>
								<text class="fcon-size">联系商家</text>
							</view>
						</view> -->
							<!-- 多套餐信息 -->
							<view class="con" v-if="orderDetials.vtype_two=='1185'">
								<view class="dp_info" @click.stop="showDpins"
									v-if="orderDetials.vstatus!='206' && orderDetials.vstatus!='225'">
									<text class="info_tits">历史消费</text>
									<view>
										<text class="tits_dpmin">用餐</text>
										<text class="dp_normal"
											:class="orderDetials.sxpDdx?.service_status=='5' || orderDetials.vstatus=='serveStop'?'dp_act':''">{{orderDetials.sxpDdx?.total_use_number || 0}}次</text>
										<text class="tits_dp_invs">/</text>
										<text class="tits_dpmin">消费</text>
										<text class="dp_normal"
											:class="orderDetials.sxpDdx?.service_status=='5'|| orderDetials.vstatus=='serveStop' ?'dp_act':''"><text
												class="dp_normal_minT">¥</text>{{orderDetials.sxpDdx?.total_use_money || '0' }}</text>
										<text class="fcon-Vector dp_icons"></text>
									</view>
								</view>
								<view class="dp_normal_items">
									<text class="normal_text">起约时间</text>
									<text class="normal_time">{{orderDetials.dpBeganTime}}</text>
								</view>
								<view class="dp_normal_items">
									<text class="normal_text">配送模式</text>
									<text class="normal_time">{{orderDetials.sxpDdx?.delivery_mode_text || ''}}</text>
								</view>
							</view>
							<!-- 菜单信息 -->
							<view class="con order-details-col2 paddingBpNo" v-if="showQuantity">
								<view class="order-d-title">
									<!-- <text class="order-d-titleL">本单总热量:{{orderDetials.goodsNutrientsVo?.energy}}Kcal</text> -->
									<text class="order-d-titleR">{{orderDetials.sellMemberName}}</text>
								</view>
								<view class="order-d-heat-ul or-padding-xs">
									<!-- <view class="order-d-heat" v-for="item in heatData" :key="item.id">
									<text class="order-d-heat-ts">{{ item.title }}</text>
									<progress class="order-d-g-w" :active="true" :percent="item.percent" :activeColor="item.color"
										duration="20" stroke-width="5" />
									<text class="order-d-heat-rl">{{ item.calorie }}</text>
								</view> -->
									<view class="order-d-heat">
										<text class="order-d-heat-ts">本单总热量</text>
										<progress class="order-d-g-w" :active="true"
											:percent="getPerc(orderDetials.goodsNutrientsVo?.energy,'energy')"
											:activeColor="getQuota(orderDetials.goodsNutrientsVo?.energy,'energy')"
											duration="20" stroke-width="5" />
										<text
											class="order-d-heat-rl">{{ orderDetials.goodsNutrientsVo?.energy||0}}/{{getMaxvo('energy')}}kcal</text>
									</view>
									<view class="order-d-heat">
										<text class="order-d-heat-ts">蛋白质</text>
										<progress class="order-d-g-w" :active="true"
											:percent="getPerc(orderDetials.goodsNutrientsVo?.protein,'protein')"
											:activeColor="getQuota(orderDetials.goodsNutrientsVo?.protein,'protein')"
											duration="20" stroke-width="5" />
										<text
											class="order-d-heat-rl">{{ orderDetials.goodsNutrientsVo?.protein||0}}/{{getMaxvo('protein')}}g</text>
									</view>
									<view class="order-d-heat">
										<text class="order-d-heat-ts">油</text>
										<progress class="order-d-g-w" :active="true"
											:percent="getPerc(orderDetials.goodsNutrientsVo?.edible_oil,'edible_oil')"
											:activeColor="getQuota(orderDetials.goodsNutrientsVo?.edible_oil,'edible_oil')"
											duration="20" stroke-width="5" />
										<text
											class="order-d-heat-rl">{{ orderDetials.goodsNutrientsVo?.edible_oil||0 }}/{{getMaxvo('edible_oil')}}g</text>
									</view>
									<view class="order-d-heat">
										<text class="order-d-heat-ts">盐</text>
										<progress class="order-d-g-w" :active="true"
											:percent="getPerc(orderDetials.goodsNutrientsVo?.salt,'salt')"
											:activeColor="getQuota(orderDetials.goodsNutrientsVo?.salt,'salt')"
											duration="20" stroke-width="5" />
										<text
											class="order-d-heat-rl">{{ orderDetials.goodsNutrientsVo?.salt||0 }}/{{getMaxvo('salt')}}g</text>
									</view>


								</view>

								<view class="order-d-heat-ul heat-con-bg">
									<uni-transition :show="showExpandedHeat" :duration="400"
										:mode-class="modeHeatClass">
										<view class="heat-con-title heat-con-ul">
											<view class="ul_widd"></view>
											<view class="ul_widd">摄入量</view>
											<view class="ul_widd">推荐量</view>
										</view>

										<view class="heat-con-ul paddingTops" v-for="(item,index) in headList"
											:key="index">
											<view class="ul_widd">{{item.name}}<text
													class="colorStyle">{{item.untils}}</text></view>
											<view class="flex justify-center ul_widd">
												<view class="text-width">{{ item.srl }}</view>
												<view class="imgHeat-con">
													<image :src="item.srcImg" mode="aspectFit"
														:style="{marginLeft:item.srcImg&&item.srcImg.indexOf('ico01.png')!=-1?'10rpx':'rpx'}">
													</image>
												</view>
											</view>
											<view class="ul_widd">{{ item.tjl }}</view>
										</view>
									</uni-transition>
									<view class="launch launchHeat" @click="launchHeat(['fade'])">
										{{showExpandedHeat ? '收起' : '更多'  }}
										<text class="cuIcon-right rotateStyle fontHeat"
											:class="{'routerHover': showExpandedHeat}"></text>
									</view>
								</view>
							</view>

							<view class="con order-details-col2">
								<view class="order-con-ul">
									<view class="con-li-menu-container"
										v-for="(item,index) in orderDetials.mainOrderData" :key="index"
										style="z-index: 999999;">
										<view class="con-li-menu-containerL">
											<view class="img-con">
												<tb-image width="100%" height="120rpx" borderRadius="26rpx"
													:src="env.imgBaseUrl+(item.specImageUrl?item.specImageUrl:item.vmaster_product_image_id|| item.vshare_image_url)">
													<template v-slot:error>
														<image src="../../../static/menuEmpty.png" mode="aspectFill"
															style="width: 100%;height: 120rpx;"></image>
													</template>
												</tb-image>
											</view>
											<view class="con-li-menu-name">
												<view class="menu_name_baseinfo">
													<text class="con-li-menuName">{{ item.vname }}<text
															class="cuIcon-questionfill ques_icos point"
															v-if="orderDetials.vtype_two=='1185'"
															@click.stop="dpTips"></text></text>
													<view class="con-li-menuPic">
														¥{{ item.nprice || item.nmoney||0 }}
													</view>
												</view>
												<view class="menu_name_baseinfo">
													<text class="con-li-menuNum"
														:style="{marginTop:(orderDetials.vtype_two!='1185' && (item.vtwo_type&&item.vtwo_type=='813'))?'50rpx':'0'}">x{{ item.nsell_nums || item.sxp_nsell_nums||0 }}
														<text class="detials_tk"
															v-if="item.nrefunding_nums&&item.nrefunding_nums>0">退款中({{item.nrefunding_nums}}份)</text><text
															v-if="item.nback_nums&&item.nback_nums>0"
															class="detials_tk margin-left-xs">已退({{item.nback_nums}}份)</text>
													</text>
													<text class="con-li-menuNames"
														v-if="item.nprice!=item.ngoods_sell_price && !item.vtwo_type">¥{{item.ngoods_sell_price || 0}}</text>
												</view>
												<view class="shopTags"
													v-if="orderDetials.vtype_two!='1185'&&item.vtwo_type!='813'&&item.vtwo_type!='814'">
													<view class="tags_item">{{item.vsku_name}}</view>
													<view class="tags_item" v-for="(it,inds) in item.labels"
														:key="inds">
														{{it.name}}
													</view>
												</view>
											</view>
										</view>
										<!-- 套餐明细 -->
										<view class="mutil_box" v-if="item.vtwo_type=='813' || item.vtwo_type=='814'">
											<view v-for="(detialsItem,detialsIndex) in item.sxpGoods"
												:key="detialsIndex" class="mutilbox_item">
												<view class="con-li-subText">
													<text class="con-li-subTextW"
														:style="{width:detialsItem.energy?'350rpx':'530rpx'}">{{detialsItem.vname}}</text>
													<text class="con-li-submenu"
														v-if="detialsItem.energy">{{detialsItem.energy}}Kcal</text>
													<text><text>x</text>{{detialsItem.nsell_nums}}</text>
												</view>
												<view>
													<text class="detials_tk"
														v-if="detialsItem.nrefunding_nums&&detialsItem.nrefunding_nums>0">退款中({{detialsItem.nrefunding_nums}}份)</text>
													<text v-if="detialsItem.nback_nums&&detialsItem.nback_nums>0"
														class="detials_tk margin-left-xs">已退({{detialsItem.nback_nums}}份)</text>
												</view>
												<view class="shopTags">
													<view class="tags_item">{{detialsItem.vsku_name}}</view>
													<view class="tags_item"
														v-for="(targDetials,targDetiaIns) in detialsItem.labels"
														:key="targDetiaIns">
														{{targDetials.name}}
													</view>
												</view>
											</view>
										</view>

									</view>
									<uni-transition :show="showExpanded" :duration="400" :mode-class="modeExpandedClass"
										:styles="orderExpandedStyles" v-if="orderDetials.hasOther">
										<view class="order-con-ul">
											<view class="con-li-menu-container"
												v-for="(item,index) in orderDetials.antherOrderData" :key="index">
												<view class="con-li-menu-containerL">
													<view class="img-con">
														<tb-image width="100%" height="120rpx" borderRadius="26rpx"
															:src="env.imgBaseUrl+(item.specImageUrl?item.specImageUrl:item.vmaster_product_image_id)">
															<template v-slot:error>
																<image src="../../../static/menuEmpty.png"
																	mode="aspectFill"
																	style="width: 100%;height: 120rpx;"></image>
															</template>
														</tb-image>
													</view>
													<view class="con-li-menu-name">
														<view class="menu_name_baseinfo">
															<text class="con-li-menuName">{{ item.vname }}<text
																	class="cuIcon-questionfill ques_icos point"
																	v-if="orderDetials.vtype_two=='1185'"
																	@click.stop="dpTips"></text></text>
															<view class="con-li-menuPic">
																¥{{ item.nprice || item.nmoney||0 }}
															</view>
														</view>
														<view class="menu_name_baseinfo">
															<text class="con-li-menuNum"
																:style="{marginTop:(orderDetials.vtype_two!='1185' && (item.vtwo_type&&item.vtwo_type=='813'))?'50rpx':'0'}">x{{ item.nsell_nums || item.sxp_nsell_nums||0 }}
																<text class="detials_tk"
																	v-if="item.nrefunding_nums&&item.nrefunding_nums>0">退款中({{item.nrefunding_nums}}份)</text><text
																	v-if="item.nback_nums&&item.nback_nums>0"
																	class="detials_tk margin-left-xs">已退({{item.nback_nums}}份)</text></text>
															<text class="con-li-menuNames"
																v-if="item.nprice!=item.ngoods_sell_price&&!(orderDetials.vtwo_type=='1185'&& (item.vtwo_type&&item.vtwo_type=='813'))">¥{{item.ngoods_sell_price || 0}}</text>
														</view>
														<view class="shopTags"
															v-if="orderDetials.vtype_two!='1185'&&item.vtwo_type!='813'&&item.vtwo_type!='814'">
															<view class="tags_item">{{item.vsku_name}}</view>
															<view class="tags_item" v-for="(it,inds) in item.labels"
																:key="inds">
																{{it.name}}
															</view>
														</view>
													</view>
												</view>
												<!-- 套餐明细 -->
												<view class="mutil_box"
													v-if="item.vtwo_type=='813' || item.vtwo_type=='814'">
													<view v-for="(detialsItem,detialsIndex) in item.sxpGoods"
														:key="detialsIndex" class="mutilbox_item">
														<view class="con-li-subText">
															<text class="con-li-subTextW"
																:style="{width:detialsItem.energy?'350rpx':'530rpx'}">{{detialsItem.vname}}</text>
															<text class="con-li-submenu"
																v-if="detialsItem.energy">{{detialsItem.energy}}Kcal</text>
															<text><text>x</text>{{detialsItem.nsell_nums}}</text>
														</view>
														<view>
															<text class="detials_tk"
																v-if="detialsItem.nrefunding_nums&&detialsItem.nrefunding_nums>0">退款中({{detialsItem.nrefunding_nums}}份)</text>
															<text
																v-if="detialsItem.nback_nums&&detialsItem.nback_nums>0"
																class="detials_tk margin-left-xs">已退({{detialsItem.nback_nums}}份)</text>
														</view>
														<view class="shopTags">
															<view class="tags_item">{{detialsItem.vsku_name}}</view>
															<view class="tags_item"
																v-for="(targDetials,targDetiaIns) in detialsItem.labels"
																:key="targDetiaIns">
																{{targDetials.name}}
															</view>
														</view>
													</view>
												</view>


											</view>
										</view>
									</uni-transition>
									<view class="launch" @click="launch(['fade'])" v-if="orderDetials.hasOther"> <text
											v-if="!showExpanded">剩余{{orderDetials.anLength}}个菜品</text><text
											class="fcon-shouqi rotateStyle"
											:class="{'routerHover': showExpanded}"></text>
									</view>

								</view>

								<view class="menu-child">
									<view class="menu-child-ul">
										<text>餐费总计</text>
										<text class="font-w">¥{{orderDetials.ntotal_money}}</text>
									</view>
									<view class="menu-child-ul">
										<text>VIP专区优惠</text>
										<text>-¥{{orderDetials.cred_coupon_money||0}}</text>
									</view>
									<view class="menu-child-ul">
										<text>代金券优惠</text>
										<text>-¥{{orderDetials.ncoupon_money||0}}</text>
									</view>
									<view class="menu-child-ul">
										<text>商品优惠</text>
										<text>-¥{{orderDetials.nman_back_money||0}}</text>
									</view>
									<view class="menu-child-ul" v-if="orderDetials.vtype_two!='1185'">
										<text>打包费</text>
										<text>¥{{shopStore.packFee}}</text>
									</view>
									<view class="menu-child-ul" v-if="orderDetials.vtype_two!='1185'">
										<text>配送费</text>
										<text>¥{{orderDetials.vfreight_money||0}}</text>
									</view>
									<view class="menu-child-ul">
										<text>总优惠</text>
										<text>¥{{orderDetials.nback_money||0}}</text>
									</view>
								</view>

							</view>
							<!-- 配送信息 -->
							<view class="con order-details-col2">
								<view class="order-d-title ">
									<text
										class="order-d-titleL color33">{{orderDetials.vtype=='568'?'取餐信息':'配送信息'}}</text>
								</view>
								<view v-if="orderDetials.vtype=='568'">
									<view class="order-address">
										<view class="order-address-l order-address-font">
											取货地址
										</view>
										<view class="order-address-r">
											<text class="text-over">{{orderDetials.sellMemberAddress}}</text>
										</view>
									</view>
									<view class="order-address">
										<view class="order-address-l order-address-font">
											配送方式
										</view>
										<view class="order-address-r">
											<text class="text-over"><text
													class="text-over-zs">{{orderDetials.vtype=='798'?'外卖配送':'到店自取'}}</text></text>
										</view>
									</view>
								</view>
								<!-- 堂食 -->
								<view v-else>
									<view class="order-address start">
										<view class="order-address-l order-address-font lh_z">
											收货地址
										</view>
										<view class="order-address-r margin-top-minx">
											<text>{{orderDetials.vaddress_detail}}</text>
											<text class="color99 font-sizieStyle">{{orderDetials.nameAPhone}}</text>
										</view>
									</view>
									<view class="order-address">
										<view class="order-address-l order-address-font">
											配送方式
										</view>
										<view class="flex-col">
											<!-- <text class="fcon-Vector-1" style="color: #53A87F;"></text>
										<text class="text-over-zs">颐而康专送</text> -->
											<text
												class="text-over-zs">{{orderDetials.vtype=='798'?'外卖配送':'到店自取'}}</text>
										</view>
									</view>
								</view>

							</view>
							<!-- 订单信息 -->
							<view class="con order-details-col2">
								<view class="order-d-title order-address-font">
									<text class="order-d-titleL color33">订单信息</text>
								</view>
								<view class="order-address">
									<view class="order-address-l order-address-font" style="min-width: 132rpx;">
										订单编号
									</view>
									<view class="flex-col">
										<text class="text-over order-address-font"
											style="max-width: 372rpx;text-align: right;">{{orderDetials.vbill_id}}</text>
										<text class="order-number-btn" @click="copyOrderNumber">复制</text>
									</view>
								</view>
								<view class="order-address">
									<view class="order-address-l order-address-font">
										下单时间
									</view>
									<view class="flex-col">
										<text
											class="text-over-zs order-address-font">{{transTime(orderDetials.vcreate_date||'')}}</text>
									</view>
								</view>
								<view class="order-address" v-if="orderDetials.vtype_two=='1184'">
									<view class="order-address-l order-address-font">
										约餐时间
									</view>
									<view class="flex-col">
										<text
											class="text-over-zs order-address-font">{{transTime(orderDetials.subscribe_time||'')}}</text>
									</view>
								</view>
								<view class="order-address" v-if="orderDetials.vstatus!='206'">
									<view class="order-address-l order-address-font">
										支付方式
									</view>
									<view class="flex-col">
										<text class="text-over-zs order-address-fonts">{{orderDetials.payName}}</text>
									</view>
								</view>

							</view>
							<!-- 拼单信息 -->
							<!-- <view class="con order-details-col2" v-if="activeType=='pindan'">
							<view class="order-address">
								<view class="order-address-l order-address-font">
									拼单信息
								</view>
								<view class="flex-col flex">
									<view class="flex splicing-con justify-between margin-right-xl">
										<image v-for="item in imgList" :key="item.id" :src="item.src" mode=""></image>
									</view>
									<view>
										<text class="color99 text-lg">拼单成功</text> <text
											class="lg text-gray cuIcon-right"></text>
									</view>
								</view>
							</view>
						</view> -->

							<!-- 备注 -->
							<view class="con order-details-col2" style="margin-bottom: 70rpx;"
								v-if="(orderDetials.vtype_two=='1185'&&orderDetials.vremarks) || (orderDetials.vtype_two!='1185'&&orderDetials.dishNums>0)">
								<view class="order-address" v-if="orderDetials.vtype_two!='1185'">
									<view class="order-address-l order-address-font">
										餐具
									</view>
									<view class="flex-col flex">
										<view class="text-lg padding-left-sm">
											{{orderDetials.dishNums}}份
										</view>
									</view>
								</view>
								<view class="order-address" v-if="orderDetials.vremarks">
									<view class="order-address-l order-address-font">
										备注
									</view>
									<view class="flex-col flex">
										<view class="text-lg padding-left-sm remakesss">
											{{orderDetials.vremarks}}
										</view>
									</view>
								</view>
							</view>


						</view>
					</scroll-view>
				</template>
			</slideContent>
			<view class="order-footer padding-right-xl" @click.stop="closeFn">
				<view class="order-footer-l p_rlt flex align-center">
					<view class="flex flex-direction align-center justify-center zxkf"
						@click.stop="goSobotUrl('https://yek-ddx.soboten.com/chat/h5/v6/index.html','69b4825bbba8408b883962c570a6287f')"
						v-if="orderDetials.vstatus!='987'&&orderDetials.vtype_two!='1185'">
						<tetx class="fcon-zhuanshukefu"></tetx>
						<text class="zxkf-font">联系客服</text>
					</view>
					<view class="point morview" @click.stop="showMore(['fade', 'zoom-in'])">
						更多
					</view>
					<view class="p_rlt ormbxline">
						<view class="morbox text-center text-lg down" :class="{show:show}">
							<view class="p_rlt padding-bottom">
								<!-- :class="!item.menuHandle||item.menuHandle&&item.menuHandle.length<=1?'padding-tb-xs':'padding-tb-xs'" -->
								<view class="mctbox sanjiao bg-white">
									<view v-for="(item,index) in menuHandle" :key="index" :class="{act: findex===index}"
										@click.stop="footerSwitch(index,item)" class="mpitm">
										{{ item.text }}
									</view>
									<!-- <view class="mpitm">
									退款
								</view> -->
								</view>
							</view>

						</view>
					</view>
					<!-- <uni-transition :show="show" :duration="300" :mode-class="modeClass" :styles="orderStyles">
					<view class="order-footer-menu point">
						<text @click="footerSwitch(index,item)" :class="{ active: findex===index }"
							v-for="(item,index) in menuHandle" :key="index">{{ item.text }}</text>
					</view>
				</uni-transition> -->
				</view>
				<view v-if="orderDetials.vstatus" class="order-footer-r">
					<!-- dpCanelShow：多套餐约餐是否显示取消订单按钮 -->
					<text class="btn cancel-btn point"
						v-if="orderDetials.vstatus == '206' || (orderDetials.vtype_two != '1184'&&orderDetials.vstatus == '1139') || dpCanelShow"
						@click.stop="callBuiness()">取消订单</text>
					<text class="btn cancel-btn point"
						v-if="orderDetials.vstatus=='987' && orderDetials.vtype_two=='1185' && orderDetials.sxpDdx?.service_status!='6'"
						@click.stop="dpBackMoney">人工客服</text>
					<text
						v-if="orderDetials.vstatus=='987' && orderDetials.vtype_two=='1185'&& orderDetials.sxpDdx?.total_balance_money>0"
						class="noBorder pay-btn point" @click.stop="toOrdeMeals">去约餐</text>
					<text class="btn cancel-btn point" v-if="invIss" @click="toInvic">查看发票</text>
					<!-- <text class="btn cancel-btn point" v-if="orderDetials.vstatus != '206' && orderDetials.vstatus != '1139'"
            @click.stop="toMenus">再来一单</text> -->
					<text v-if="orderDetials.vstatus == '206'" class="btn  pay-btn point"
						@click.stop="callst">立即支付</text>
					<view
						v-if="orderDetials.vstatus == '61'|| orderDetials.vstatus=='988' || orderDetials.vstatus=='827'"
						class="btn toEval point solid"
						@click.stop="mnavTo('/pages/user/evaluate/evaluate?vbill_id='+ orderDetials.vbill_id)">去评价
					</view>
				</view>
			</view>
			<payType ref="payModal" source="immediately" :totalPayPrice="immdelTotalMoney" :vbillid="immdeBillids"
				@paySuccess="paySuccess" :carNumber="orderDetials.sxpDdx?Number(orderDetials.sxpDdx.card_no):''"></payType>
			<!-- 配送状态 -->
			<delStas ref="delStasRef" />
			<!-- 套餐问号提示 -->
			<dpTipsModel ref="dpTipRef" :dpTips="orderDetials.sxpEndtime || ''" />
			<!-- 套餐退款提示 -->
			<refundTips ref="refundTipsRef" :totalPri="orderDetials.sxpDdx?.total_balance_money || 0" />
			<!-- 套餐消费明细 -->
			<dpDetials ref="dpExpendRef" :costNum="orderDetials.sxpDdx?.total_use_number || 0"
				:costPrice="orderDetials.sxpDdx?.total_use_money || 0" :billsId="orderDetials.sxpDdx?.bill_id" />
			<!-- 修改约餐时间或地址 -->
			<editTime ref="autoMealRef" :goodsId="dpSetmeal.vgoods_id" :fbillId="dpSetmeal.vbill_id"
				:mealsName="dpSetmeal.goodsSkuName"></editTime>
			<loading></loading>
		</view>
	</view>
</template>

<script setup lang="ts">
	import { ref, nextTick } from 'vue';
	import { onShow, onLoad, onHide, onUnload } from "@dcloudio/uni-app";
	import slideContent from '@/uni_modules/you-touchbox/components/you-touchbox/you-touchbox.vue'
	import { billDetail, getCancelorder, getremoveOrder, queryNutrients, billDetailRefund, getStoreList } from '@/api/vmeitime-http/index.js'
	import { mnavTo, showLoading, hideLoading } from '@/utils/helper';
	import { getSellerConfig } from '@/utils/public';
	import mapi from '@/utils/mapi'
	import delStas from './delStas.vue';
	import dpTipsModel from './dpTipsModel.vue'
	import refundTips from '@/components/refundTips/refundTips.vue';
	import dpDetials from './dpDetials.vue';
	import editTime from "@/components/setMealsModal/setMealsModal.vue";
	import { env } from '@/api/env.js';
	// import { useShopStore } from '@/stores/shopStore';
	// const f = useShopStore();
	// 获取屏幕边界到安全区域距离
	import { useShopStore } from '@/stores/shopStore';

	const shopStore = useShopStore();
	// const { safeAreaInsets } = uni.getSystemInfoSync()
	const showExpandedHeat = ref(null) //展开热量
	const showQuantity = ref(true)
	const payModal = ref()
	const immdelTotalMoney = ref(0)
	const immdeBillids = ref()
	const modeHeatClass = ref() //展示更多菜品
	const modeClass = ref() ///小菜单动画效果
	const orderStyles = ref() //小菜单动画效果样式
	const dpTipRef = ref()
	const show = ref(false)
	const scrollTop = ref(0)
	const autoMealRef = ref()
	let countDownIn = ref(null)
	let countDownDesc = ref('')
	const showExpanded = ref(null) //展示更多菜品
	const modeExpandedClass = ref() //展示更多菜品
	const orderExpandedStyles = ref() //展示更多菜品
	const sildContRef = ref()
	const orderId = ref() //订单ID
	const orderType = ref() //订单类型
	const activeType = ref() //活动类型-拼单
	const dpExpendRef = ref()
	const orderDetials = ref<any>({})
	const dpSetmeal = ref<any>({})
	const orderStatusText = ref('准备好')
	const bookingTime = ref('因配送订单较多，送达时间可能波动')
	const allowSlide = ref(true)
	const findex = ref(0)
	const invoicing = ref() //开发票
	const deliveryTime = ref('13:59 - 18:14') //订单时间
	const noScrBot = ref(true)
	const isMoving = ref(false)
	const invIss = ref(false)
	const loaded = ref(false)
	const delStasRef = ref()
	const refundTipsRef = ref()
	const dpCanelShow = ref(false)
	const queryNutrientsList = ref([])
	const statusMap = ref({
		'206': { text: '待付款，剩余', time: '14:53 分' },
		'1139': { text: '商家待接单，剩余', time: '14:53 分' },
		'1140': { text: '商家已接单，正在制作中' },
		'1142': { text: '骑手已接单' },
		'1143': { text: '骑手已取餐' },
		'1144': { text: '订单配送中' },
		'61': { text: '订单已完成' },
		'827': { text: '待评价' },
		'297': { text: '已评价' },
		'310': { text: '已退款' },
		'223': { text: '退款中' },
		'224': { text: '退款中' },
		'225': { text: '订单已取消' },
		'819': { text: '待自提' },
		'987': { text: '套餐服务中' },
		'serveStop': { text: '套餐已截止' },//该订单状态为自定义订单状态
	})
	const state = ref({
		latitude: 28.208399,
		longitude: 113.06463,
		mapLatitude: 28.208399,
		mapLongitude: 113.06463,
		covers: [
			{
				id: 1,
				width: 50,
				height: 50,
				latitude: 28.208,
				longitude: 113.055,
				iconPath: "../../../static/map_ico02.png",
				contName: "商家已接单",
				// customCallout: {
				//   // content:"商家已接单",
				//   // fontSize:"32rpx",
				//   anchorX: 0,
				//   anchorY: 2,
				//   display: 'ALWAYS',
				// }
				callout: {
					content: "商家已接单",
					display: 'ALWAYS',
					fontSize: "32rpx",
					padding: 5,
					borderRadius: 10,
					color: "#000"
				}
			}, {
				id: 2,
				width: 40,
				height: 45,
				iconPath: "../../../static/map_ico03.png",
				latitude: 28.208399,
				longitude: 113.06463,
				// callout: {
				// 	content:"我",
				// 	display: 'ALWAYS',
				// 	fontSize:"32rpx",
				// 	padding:10,
				// 	borderRadius:10,
				// }
			}
		],
		scale: 14, //地图层级，取值范围为5-18，默认16，14最优，11看长沙市
	})
	onUnload(() => {
		uni.removeStorageSync('storedGoodsId');
	})

	// customCards: [{
	//     customCardId:orderDetials.value.mainOrderData[0].vgoods_id,
	//     customCardStatus: orderDetials.value.mainOrderData[0].goodsStatus,  
	//     customCardCode: orderDetials.value.mainOrderData[0].vbill_id,
	//     customCardTime: orderDetials.value.orderedTimes,
	//     customCardName: orderDetials.value.mainOrderData[0].vname,
	//     customCardThumbnail: env.imgBaseUrl+(orderDetials.value.mainOrderData[0].specImageUrl?orderDetials.value.mainOrderData[0].specImageUrl:orderDetials.value.mainOrderData[0].vmaster_product_image_id),
	//     customCardAmount: orderDetials.value.mainOrderData[0].ngoods_sell_price,
	//     customCardAmountSymbol: "¥",
	//     customMiniProgramUrl:`/pages/order/orderDetails/orderDetails`,
	//      customMenus: [{
	//           menuType: 2,
	//           menuName: "发送订单给客服"
	//       }, {
	//           menuType: 0,
	//           menuName: "查看详情",
	//           menuMiniProgramUrl:`/pages/order/goodsDetial/goodsDetial`,
	//           menuLinkType: 2
	//       }, {
	//           menuType: 1,
	//           menuName: "确认订单",
	//           menuTip: "您已确认订单信息"
	//       }]
	//  }],
	// 咨询客服
	const createOrderUpdateData = () => {
		return {
			cardId: orderDetials.value.vbill_id,
			cardStyle: 1,
			cardType: 1,
			cardGuide: "请核对您的订单信息",
			miniProgramUrl: '/pages/order/orderDetails/orderDetails',
			customField: {
				"门店": orderDetials.value.sellMemberName,
				"订单编号": orderDetials.value.vbill_id,
				"联系方式": orderDetials.value.shopPhone
			},
			// customMiniProgramUrl:`/pages/order/orderDetails/orderDetails`,
			// cardLink: `/pages/order/goodsDetial/goodsDetial`,
			customCards: orderDetials.value.mainOrderData.map(order => ({
				customCardId: order.vbill_id,
				customCardStatus: order.goodsStatus,
				customCardCode: order.vbill_id,
				customCardTime: orderDetials.value.orderedTimes,
				customCardName: order.vname,
				customCardThumbnail: env.imgBaseUrl + (order.specImageUrl ? order.specImageUrl : order.vmaster_product_image_id),
				customCardAmount: order.ngoods_sell_price,
				customCardAmountSymbol: "¥",
				customCardLink: "/pages/order/orderDetails/orderDetails",
				customMenus: [{
					menuType: 2,
					menuName: "x" + order.nsell_nums,
					menuLinkType: 2
				}]
			})),
			cardMenus: [{
				menuType: 0,
				menuName: "查看详情",
				menuMiniProgramUrl: `/pages/order/orderDetails/orderDetails`,
				menuLinkType: 2
			}, {
				menuType: 2,
				menuName: "发送订单给客服"
			}]
		};
	}
	// const da = () => {
	//     return {
	//         order_status :0,
	//         status_custom:0,
	//         order_code:orderDetials.value.vbill_id,
	//         order_url:'/pages/order/orderDetails/orderDetails',
	//         goods_count:2,
	//         total_fee:200,
	//         goods:[
	//           {
	//             name : orderDetials.value.mainOrderData[0].vname,
	//             pictureUrl:env.imgBaseUrl+(orderDetials.value.mainOrderData[0].specImageUrl?orderDetials.value.mainOrderData[0].specImageUrl:orderDetials.value.mainOrderData[0].vmaster_product_image_id)
	//           }
	//         ]
	//     }; 
	// };

	const goSobotUrl = (url, sysnum) => {

		console.log('订单ID----------', orderDetials.value.mainOrderData[0].vbill_id)
		const data = createOrderUpdateData()
		console.log('url', url);
		if (!url) return;
		if (url.substring(0, 5) == 'https' || url.substring(0, 3) == 'www') {
			mnavTo('/pages/user/sobot_common/sobot_common?urlPath=' + encodeURIComponent(JSON.stringify(url)) + '&paramData=' + encodeURIComponent(JSON.stringify({ sysnum: sysnum })) + '&dataInfo=' + encodeURIComponent(JSON.stringify(data)))

		} else {
			mnavTo(url)
		}
	}

	const changeSlide = (e) => {
		noScrBot.value = !(e.curTop == e.minTop)
		isMoving.value = false
		// minTop: this.min,
		// maxTop: this.max,
		// curTop: this.top
	}
	const slideAct = () => {
		isMoving.value = true
		// if(noScrBot.value){
		// 	isMoving.value=true
		// 	console.log("向下滑动")
		// }else{
		// 	isMoving.value=true
		// 	console.log("向上滑动")
		// }

	}
	const headList = ref<any>([
		{
			id: 0,
			name: '膳食纤维',
			srl: '104.8',
			tjl: '27-40',
			srcImg: 'https://cdn-static.yekjx.com/food/ico/images/order_ico02.png',
			untils: '(g)'
		},
		{
			id: 1,
			name: '维A',
			srl: '49',
			tjl: '45-60',
			srcImg: 'https://cdn-static.yekjx.com/food/ico/images/order_ico01.png',
			untils: '(μg)'
		},
		{
			id: 2,
			name: '维C',
			srl: '143.6',
			tjl: '149-194',
			srcImg: 'https://cdn-static.yekjx.com/food/ico/images/order_ico03.png',
			untils: '(mg)'
		},
		{
			id: 3,
			name: '钙',
			srl: '10.6',
			tjl: '125-35',
			srcImg: 'https://cdn-static.yekjx.com/food/ico/images/order_ico03.png',
			untils: '(mg)'
		},
		{
			id: 4,
			name: '铁',
			srl: '55',
			tjl: '36-72',
			srcImg: 'https://cdn-static.yekjx.com/food/ico/images/order_ico02.png',
			untils: '(mg)'
		},
		{
			id: 5,
			name: '食物种类',
			srl: '9',
			tjl: '12-21',
			srcImg: 'https://cdn-static.yekjx.com/food/ico/images/order_ico03.png',
			untils: ''
		}
	])


	const menuHandle = ref<any>([
		{
			id: '0',
			text: '投诉'
		}
	])

	const imgList = ref([
		{
			id: 0,
			src: 'https://cdn-static.yekjx.com/food/images/us_img01.png'
		},
		{
			id: 1,
			src: 'https://cdn-static.yekjx.com/food/images/us_img02.png'
		},
		{
			id: 2,
			src: 'https://cdn-static.yekjx.com/food/images/us_img03.png'
		}
	])

	const heatData = ref([
		{
			id: 0,
			title: '碳水',
			percent: 50,
			calorie: '2684g',
			color: '#53A87F'
		},
		{
			id: 1,
			title: '脂肪',
			percent: 80,
			calorie: '2684g',
			color: '#FFA195'
		},
		{
			id: 2,
			title: '蛋白质',
			percent: 20,
			calorie: '2684g',
			color: '#FDB44A'
		}
	])
	const toBack = () => {
		uni.navigateBack()
	}

	const launch = (type : any) => {
		modeExpandedClass.value = type
		showExpanded.value = !showExpanded.value
	}

	const launchHeat = (type : any) => {
		modeHeatClass.value = type
		showExpandedHeat.value = !showExpandedHeat.value
	}

	const copyOrderNumber = () => {
		uni.setClipboardData({
			data: orderDetials.value.vbill_id,
			success: function () {
				uni.showToast({
					title: '已复制订单编号',
					icon: 'none'
				});
			}
		});
	}

	const gotoMap = () => {
		if (orderDetials.value.location) {
			uni.openLocation({
				longitude: Number(orderDetials.value.location.split(',')[0]),
				latitude: Number(orderDetials.value.location.split(',')[1]),
				scale: 17, //5-18，默认18
				name: orderDetials.value.sellMemberName,
				address: orderDetials.value.sellMemberAddress
			});
		}
	}
	const footerSwitch = (index : any, item : any) => {
		findex.value = index;
		//0投诉，1开票，2删除，3退款
		if (item.id == '1' || item.text == '开票') {
			if (!invoicing.value) {
				mnavTo('/pages/others/applyInvoic/applyInvoic?vbill_id=' + orderDetials.value.vbill_id + '&ntotal_money=' + orderDetials.value.npay_total_money + '&vfreight_money=' + orderDetials.value.vfreight_money)
			} else {
				mnavTo('/pages/others/completedDettial/completedDettial?needInvoiceId=' + invoicing.value)
			}
		} else if (item.id == '0' || item.text == '投诉') {
			//feedback/feedback
			mnavTo('/pages/user/feedback/feedback?vbill_id=' + orderDetials.value.vbill_id)
		} else if (item.id == '3' || item.text == '退款') {
			mnavTo(`/pages/order/applicationRefund/applicationRefund?vbill_id=${orderDetials.value.vbill_id}&shopName=${orderDetials.value.sellMemberName||''}`)
		} else if (item.id == '2' || item.text === '删除') {
			toDeleteOrder()
		} else if (item.id == '4' || item.text === '再来一单') {
			toMenus()
		}

	}
	const toInvic = () => {
		mnavTo('/pages/others/completedDettial/completedDettial?needInvoiceId=' + invoicing.value)
	}
	const toDeleteOrder = () => {
		uni.showModal({
			title: '提示',
			content: '确定要删除订单吗?',
			confirmText: '确定',
			confirmColor: '#2AB05E',
			success: async res => {
				if (res.confirm) {
					try {
						showLoading()
						let res = await getremoveOrder({ billId: orderId.value })
						if (!res.result) {
							mapi.msg("网络繁忙，请稍后再试!")
							return
						}
						if (res.result) {
							mapi.msg("订单删除成功")
							hideLoading()
							setTimeout(() => {
								uni.switchTab({
									url: '/pages/index/order/order'
								})
							}, 1000)
						}
					} catch (e) {
						mapi.msg('网络繁忙，请稍后再试!')
					}

				}
			}
		})
	}
	const callCust = () => {
		uni.makePhoneCall({
			phoneNumber: orderDetials.value.personContact
		});
	}
	const showMore = (type : any) => {
		show.value = !show.value
		modeClass.value = type
	}

	const closeFn = () => {
		if (show.value) {
			show.value = false
		}
	}
	const callBuiness = () => {
		// if(sxpDdx&&sxpDdx.allow_modify_time && nres.vtype_two == '1184'&& (nres.vstatus == '206'||nres.vstatus == '1139'||nres.vstatus == '1140')){
			
		// }
		uni.showModal({
			title: '提示',
			content: '确定要取消订单吗?',
			confirmText: '确定',
			confirmColor: '#2AB05E',
			success: async res => {
				if (res.confirm) {
					try {
						showLoading()
						//billDetailRefund
						// 根据订单状态选择合适的请求
						console.log('orderDetials.value.vstatus---', orderDetials.value.vstatus)
						const apiCall = orderDetials.value.vstatus === '1139'||orderDetials.value.vstatus === '1140'
							? billDetailRefund({ vbill_id: orderId.value })
							: getCancelorder({ vbill_id: orderId.value });

						const response = await apiCall;
						hideLoading();
						if (!response.result) {
							mapi.msg(response.shortMessage||"网络繁忙，请稍后再试!");
							return;
						}
						mapi.msg("订单取消成功");
						setTimeout(() => {
							uni.switchTab({ url: '/pages/index/order/order' });
						}, 1000);
					} catch (e) {
						console.error(e)
						mapi.msg('网络繁忙，请稍后再试!')
					}

				}
			}
		})
	}
	const callst = () => {
		immdelTotalMoney.value = orderDetials.value.ntotal_money
		immdeBillids.value = orderDetials.value.vbill_id
		if (orderDetials.value.vtype_two == '1185') {
			payModal.value.wxPay(orderDetials.value.vbill_id)
			return
		}
		payModal.value?.open('bottom')
	}
	onLoad((option : any) => {
		orderStyles.value = {  //小菜单
			position: "absolute",
			top: "-170rpx",
			left: "50rpx",
			width: "126rpx",
			padding: "10rpx 0",
			flexShrink: 0,
			zIndex: "999999",
			borderRadius: '2px 2px 4px 4px',
			backgroundColor: "#fff",
			display: "flex",
			flexDirection: "column",
			justifyContent: "center",
			boxShadow: '0px 3px 6px -4px rgba(0, 0, 0, 0.12), 0px 6px 16px 0px rgba(0, 0, 0, 0.08), 0px 9px 28px 8px rgba(0, 0, 0, 0.05)'
		}
		// activeType:'pindan',
		// type: 1, //套餐配送 0堂食 1外送
		const storedGoodsId = uni.getStorageSync('storedGoodsId');
		orderId.value = storedGoodsId ? storedGoodsId : option.vbill_id;
		// orderId.value = option.vbill_id
		orderType.value = option.type || ''
		activeType.value = option.activeType || ''
		// invoicing.value = option.needInvoiceId == "null" ? '' : option.needInvoiceId
		console.log('options', option)
		getOrderDetials()
	});
	onShow(() => {
		nextTick(()=>{
			autoMealRef.value.upAdress();
			loaded.value && getOrderDetials();
			scrollTop.value = 0;
		})
		
	})
	onHide(() => {
		show.value = false
		// if(!noScrBot.value){
		setTimeout(() => {
			scrollTop.value = 1
			sildContRef.value.setBottom('0.9')
			noScrBot.value = true
		}, 500)
		// }
	})
	const paySuccess = () => {
		showLoading()
		setTimeout(() => {
			getOrderDetials('paySuccess')
			hideLoading()
		}, 1000)
	}
	const toMenus = async () => {
		// shopStore.setQrShop(orderDetials.value.nsell_member_id)
		await getSellerConfig()
		if (shopStore.hasShut && orderDetials.value.vtype_two != '920') {
			mapi.msg("该门店已打烊")
			return
		}
		shopStore.setOrderAgain(true)
		let shopGps = await getStoreList({
			vIsFirstShop: '猪会飞',
			curPage: 1,
			pageSize: 200,
			sellShopId: orderDetials.value.nsell_member_id,
			longitude: 113.06463,
			latitude: 28.208399,
			sku: '',
			vtype_two_category: 0,
		})
		let shopStorData : any = []
		if (shopGps.result) {
			for (let key in shopGps.object) {
				let item = shopGps.object[key]
				shopStorData.push(item)
			}
		}
		let params : any = {}
		if (orderDetials.value.vtype_two == '920') {
			params.patten = 'SUBSCRIBE'
		}
		params.sellMemberIds = orderDetials.value.nsell_member_id
		params.localInfo = {
			lo: shopStorData.length > 0 && shopStorData[0].vgps ? shopStorData[0].vgps.split(',')[0] : '113.064388',
			la: shopStorData.length > 0 && shopStorData[0].vgps ? shopStorData[0].vgps.split(',')[1] : '28.208595',
		}
		params.shopParams = orderDetials.value.billGoods.map((item : any) => {
			if (item.vtwo_type != '813') {
				let labelIdsArray = item.labels ? item.labels.map((item : any) => item.id) : []
				return {
					sku: item.sku,
					nums: item.nsell_nums,
					shopType: '0',
					defaultServiceType: "795",
					labelIds: labelIdsArray,
					isVip: item.vipFlag == '5' ? '1' : '0',
					specialId: item.specialId,
					type: item.vtwo_type == '813' ? 'dp' : 'sp'
				}
			} else {
				let detailsArry = item.sxpGoods.map((sitem : any) => {
					return {
						dynamic_conver_group_id: sitem.sxp_group_id,
						labelIds: sitem.labelIds || [],
						sku: sitem.sku,
						nums: sitem.nsell_nums,

					}
				})
				return {
					dynamic_id: item.sxp_goods_id,
					nums: item.sxp_nsell_nums,
					details: detailsArry,
					type: item.vtwo_type == '813' ? 'dp' : 'sp'
				}
			}
		})
		let obj = { id: '3', source: 'orderDetial', action: 'addCarsDet', shopResult: params }
		uni.setStorageSync('menuact', obj)
		uni.switchTab({
			url: "/pages/index/menu/menu"
		})
	}
	const reflafhMap = () => {
		getOrderDetials('reflash')
	}
	const getOrderDetials = async (source : any = '') => {
		try {
			let res = await billDetail({ vbill_id: orderId.value })
			let resultNutrients = await queryNutrients({})//订单热量推荐
			let nresNutrients = resultNutrients.object || []
			queryNutrientsList.value = nresNutrients.map((item : any) => ({
				...item,
				columns_name: item.columns_name.toLowerCase()
			}));
			if (!res.result) {
				loaded.value = true
				return
			}
			let nres = res.object||{},sxpDdx = nres.sxpDdx||null;
			clearInterval(countDownIn.value);//清除倒计时定时器
			menuHandle.value = [
				{
					id: '0',
					text: '投诉'
				}
			]
			// res.object.vaddre_detail = res.object.vaddre_detail.replace(/&middot;/g, '·');
			orderDetials.value = nres;
			orderDetials.value.vaddress_detail = orderDetials.value.vaddress_detail.replace(/&middot;/g, '·');
			const nutrientMappings = [
				{ key: 'dietary_fiber', index: 0 },   // 膳食纤维
				{ key: 'vtamina', index: 1 },         // 维生素A
				{ key: 'vtaminc', index: 2 },         // 维生素C
				{ key: 'calcium', index: 3 },         // 钙
				{ key: 'iron', index: 4 },            // 铁
				{ key: 'food_nums', index: 5 }        // 食物种类
			]
			nutrientMappings.forEach(({ key, index }) => {
				headList.value[index].srl = nres.goodsNutrientsVo[key] || 0;
				headList.value[index].columNames = key
				headList.value[index].srcImg = getNutrition(headList.value[index])
				headList.value[index].tjl = getTjl(headList.value[index])

			});
			invoicing.value = orderDetials.value.needInvoiceId
			if (sxpDdx?.total_balance_money > 0 && sxpDdx?.service_status == '6') {
				orderDetials.value.vstatus = 'serveStop'
			}
			let allQuantitySrlZero = headList.value.every((item : any) => item.srl == 0)
			if (!allQuantitySrlZero || orderDetials.value.goodsNutrientsVo.energy > 0 || orderDetials.value.goodsNutrientsVo.protein > 0 || orderDetials.value.goodsNutrientsVo.edible_oil > 0 || orderDetials.value.goodsNutrientsVo.salt > 0) {
				showQuantity.value = true
			} else {
				showQuantity.value = false
			}
			if (invoicing.value && invoicing.value != '') {
				invIss.value = true
			} else {
				if (orderDetials.value.vstatus == '61' || orderDetials.value.vstatus == '827' || orderDetials.value.vstatus == '297') {
					menuHandle.value.push({ text: '开票', id: '1' });
					invIss.value = false
				}
			}

			const deleteStatuses = ['1139', '1140', '1142', '1143', '1144'];
			if (!deleteStatuses.includes(orderDetials.value.vstatus)) {
				menuHandle.value.push({ text: '删除', id: '2' });
			}
			const hideStatuses = ['206', '225', '223', '310', '987', '224', 'serveStop'];
			if (!hideStatuses.includes(orderDetials.value.vstatus)) {
				menuHandle.value.push({ text: '退款', id: '3' });
			}

			if (orderDetials.value.vstatus != '206' && orderDetials.value.vstatus != '1139' && orderDetials.value.vtype_two != '1185' && orderDetials.value.vtype_two != '1184') {
				menuHandle.value.push({ text: '再来一单', id: '4' });
			}
			// orderDetials.value.tkShow = !hideStatuses.includes(orderDetials.value.vstatus);
			if (orderDetials.value.vstatus == '206') {
				bookingTime.value = '倒计时结束，订单将自动关闭，请及时付款'
				orderStatusText.value = '准备好'
			} else if (orderDetials.value.vstatus == '1139' || orderDetials.value.vstatus == '1140' || orderDetials.value.vstatus == '1142' || orderDetials.value.vstatus == '1143') {
				orderStatusText.value = '送达'
				bookingTime.value = '因配送订单较多，送达时间可能波动'
			} else if (orderDetials.value.vstatus == '61') {
				orderStatusText.value = '感谢您对炖大侠的信任，期待再次光临'
			}
			allowSlide.value = nres.vstatus == '1140' && nres.vtype == '798' ? false : true
			let mainOrderData = []
			let antherOrderData = []
			if (nres.billGoods && nres.billGoods.length > 2) {
				nres.billGoods.forEach((item : any, index : any) => {
					if (index <= 1) {
						mainOrderData.push(item);
					} else {
						antherOrderData.push(item);
					}
				});
				orderDetials.value.hasOther = true
			} else {
				mainOrderData = nres.billGoods
				orderDetials.value.hasOther = false
			}
			if (menuHandle.value.length == 1) {
				orderStyles.value = {  //小菜单
					position: "absolute",
					top: "-110rpx",
					left: "50rpx",
					width: "126rpx",
					padding: "10rpx 0",
					flexShrink: 0,
					zIndex: "999999",
					borderRadius: '2px 2px 4px 4px',
					backgroundColor: "#fff",
					display: "flex",
					flexDirection: "column",
					justifyContent: "center",
					boxShadow: '0px 3px 6px -4px rgba(0, 0, 0, 0.12), 0px 6px 16px 0px rgba(0, 0, 0, 0.08), 0px 9px 28px 8px rgba(0, 0, 0, 0.05)'
				}
			}
			// orderDetials.value.orderedTimes = `${nres.vcreate_date.slice(0, 4)}-${nres.vcreate_date.slice(4, 6)}-${nres.vcreate_date.slice(6, 8)}` + " " + nres.vcreate_date.slice(8, 10) + ":" + nres.vcreate_date.slice(10, 12) + ":" + nres.vcreate_date.slice(12, 14)
			orderDetials.value.mainOrderData = mainOrderData
			orderDetials.value.antherOrderData = antherOrderData
			orderDetials.value.anLength = antherOrderData.length
			dpSetmeal.value.vbill_id = sxpDdx ? sxpDdx.bill_id : ''
			dpSetmeal.value.vgoods_id = sxpDdx ? sxpDdx.goods_id : ''
			dpSetmeal.value.goodsSkuName = sxpDdx ? sxpDdx.goods_name : ''
			dpSetmeal.value.nsell_member_id = sxpDdx ? sxpDdx.sell_member_id : ''
			orderDetials.value.nameAPhone = nres.vconsignee + " " + `${nres.vphone.slice(0, 3)}****${nres.vphone.slice(7)}`
			if (nres.subscribe_time && nres.subscribe_time != null) {
				const year = nres.subscribe_time.slice(0, 4)
				const month = nres.subscribe_time.slice(4, 6).replace(/^0/, '');
				const day = nres.subscribe_time.slice(6, 8);
				const hour = nres.subscribe_time.slice(8, 10);
				const minute = nres.subscribe_time.slice(10, 12);
				orderDetials.value.selfPickTimes = `${month}月${day}日 ${hour}:${minute}`;
				deliveryTime.value = formatTimeRange(nres.subscribe_time)
				orderDetials.value.dpBeganTime = `${year}-${month}-${day}`//多套餐起约时间
			}
			//多套餐约餐是否显示取消订单按钮 
			if (sxpDdx&&sxpDdx.allow_modify_time && nres.vtype_two == '1184'&& (nres.vstatus == '206'||nres.vstatus == '1139'||nres.vstatus == '1140')) {
				const allowTime = Number(sxpDdx.allow_modify_time);
				// let now = new Date();
				// let currentTime = now.getHours() * 60 + now.getMinutes();
				// let [allowHours, allowMinutes] = sxpDdx.allow_modify_time.split(':').map(Number);
				// let allowTime = allowHours * 60 + allowMinutes;
				dpCanelShow.value = nres.vstatus == '206'?true:Date.now() <= allowTime;
				// console.log('allow_modify_time',currentTime,allowTime)
			}
			if (sxpDdx && sxpDdx.end_time && sxpDdx.end_time != null) {
				let result = sxpDdx.end_time
				const year = result.slice(0, 4);
				const month = result.slice(4, 6);
				const day = result.slice(6, 8);
				// const hour = result.slice(8, 10);
				// const minute = result.slice(10, 12);
				// const second = result.slice(12, 14);
				let finals = `${year}-${month}-${day}`
				orderDetials.value.sxpEndtime = finals
			}

			//进行倒计时
			if (nres.vstatus == '206' || nres.vstatus == '1139') {
				let canelTimes = nres.vstatus == '206' ? nres.billCancelTime || 0 : nres.unAcceptedCancelTime || 0
				let endtime = calculateFutureTimestamp(nres.vcreate_date, canelTimes)
				updateCountdown(endtime);
				countDownIn.value = setInterval(() => {
					updateCountdown(endtime);
				}, 1000);

			}
			if (nres.vstatus == '1140' && nres.vtype == '798' && source != 'reflash') {
				setTimeout(() => {
					noScrBot.value = false
					sildContRef.value.setBottom('290')
				}, 500)
			} else {
				if (loaded.value) {
					setTimeout(() => {
						sildContRef.value.setBottom('0.9')
						noScrBot.value = true
					}, 500)
				}
			}
			loaded.value = true
		} catch (e) {
			//TODO handle the exception
			console.error(e, "eee")
			loaded.value = true
		}
	}
	const transTime = (t) => {
		let r = '';
		if (t) {
			r = `${t.slice(0, 4)}-${t.slice(4, 6)}-${t.slice(6, 8)}` + " " + t.slice(8, 10) + ":" + t.slice(10, 12) + ":" + t.slice(12, 14)
		}
		return r
	}
	const calculateFutureTimestamp = (data : any, minutesToAdd : any) => {
		// 提取年月日时分秒
		let year = parseInt(data.slice(0, 4), 10);
		let month = parseInt(data.slice(4, 6), 10) - 1;
		let day = parseInt(data.slice(6, 8), 10);
		let hour = parseInt(data.slice(8, 10), 10);
		let minute = parseInt(data.slice(10, 12), 10);
		let second = parseInt(data.slice(12, 14), 10);
		let date = new Date(year, month, day, hour, minute, second);
		// 计算指定分钟之后的时间戳
		return date.getTime() + minutesToAdd * 60 * 1000;
	}
	const updateCountdown = (endTime : any) => {
		let currentTime = Date.now();
		let remainingTime = endTime - currentTime;

		if (remainingTime <= 0) {
			clearInterval(countDownIn.value);
			// loaded.value && getOrderDetials() //倒计时结束刷新订单状态
			if (orderDetials.value.vstatus == '206') {
				statusMap.value[206].time = `00:00`
			} else if (orderDetials.value.vstatus == '1139') {
				statusMap.value[1139].time = `00:00`
			}
			return;
		}
		let remainingMinutes = Math.floor(remainingTime / 1000 / 60).toString().padStart(2, '0');
		let remainingSeconds = Math.floor((remainingTime / 1000) % 60).toString().padStart(2, '0');
		countDownDesc.value = `${remainingMinutes}:${remainingSeconds}`
		if (orderDetials.value.vstatus == '206') {
			statusMap.value[206].time = countDownDesc.value
		} else if (orderDetials.value.vstatus == '1139') {
			statusMap.value[1139].time = countDownDesc.value
		}


	}
	const formatTimeRange = (subscribeTime : any) => {
		const year = subscribeTime.slice(0, 4);
		const month = subscribeTime.slice(4, 6) - 1;
		const day = subscribeTime.slice(6, 8);
		const hour = subscribeTime.slice(8, 10);
		const minute = subscribeTime.slice(10, 12);
		const second = subscribeTime.slice(12, 14);
		let startTime = hour + ':' + minute
		const date = new Date(year, month, day, hour, minute, second);
		const timestamp = date.getTime();
		const thirtyMinutesLaterTimestamp = timestamp + 30 * 60 * 1000;
		const newDate = new Date(thirtyMinutesLaterTimestamp);
		const newHour = String(newDate.getHours()).padStart(2, '0');
		const newMinute = String(newDate.getMinutes()).padStart(2, '0');
		let endTime = newHour + ":" + newMinute
		return `${startTime}-${endTime}`;
	}
	const getNutrition = (nres : any) => {
		const matchedItem = queryNutrientsList.value.find(item => item.columns_name == nres.columNames);
		if (matchedItem) {
			const { srl } = nres;
			const { max_value, min_value } = matchedItem;
			if (srl < min_value) {
				return 'https://cdn-static.yekjx.com/food/ico/images/order_ico03.png';
			} else if (srl >= min_value && srl <= max_value) {
				return 'https://cdn-static.yekjx.com/food/ico/images/order_ico01.png';
			} else if (srl > max_value) {
				return 'https://cdn-static.yekjx.com/food/ico/images/order_ico02.png';
			}
		}
		return 'https://cdn-static.yekjx.com/food/ico/images/order_ico01.png';
	};
	const getTjl = (nres : any) => {
		const matchedItem = queryNutrientsList.value.find(item => item.columns_name == nres.columNames);
		if (matchedItem) {
			const { max_value, min_value } = matchedItem;
			let str = min_value + '-' + max_value
			return str
		}
	}
	const getQuota = (srl : any, columNames : any) => {
		const matchedItem = queryNutrientsList.value.find(item => item.columns_name == columNames);
		if (matchedItem) {
			const { max_value, min_value } = matchedItem;
			if (srl < min_value) {
				return '#FDB44A';
			} else if (srl >= min_value && srl <= max_value) {
				return '#53A87F';
			} else if (srl > max_value) {
				return '#FFA195';
			}
		}
		return '#53A87F';
	}
	const getPerc = (srl : any, columNames : any) => {
		const matchedItem = queryNutrientsList.value.find(item => item.columns_name == columNames);
		if (matchedItem) {
			const { max_value } = matchedItem;
			let pres = (Number(srl) / Number(max_value)) * 100
			return pres
		}
		return 0;
	}
	const getMaxvo = (nres : any) => {
		const matchedItem = queryNutrientsList.value.find(item => item.columns_name == nres);
		if (matchedItem) {
			const { max_value } = matchedItem;
			return max_value
		}
		return 0
	}
	const toDelsSta = () => {
		delStasRef.value.open()
	}
	const dpTips = () => {
		dpTipRef.value.open()

	}
	const showDpins = () => {
		dpExpendRef.value.open()
	}
	const dpBackMoney = () => {
		refundTipsRef.value.open()
	}
	const toOrdeMeals = () => {
		mnavTo(`/pages/order/manyMeal/manyMeal?hasRecord=true&fbillId=${orderDetials.value.sxpDdx.bill_id}&goodsId=${orderDetials.value.sxpDdx.goods_id}&sellerMemberId=${orderDetials.value.sxpDdx.sell_member_id}`)
	}

	const editAutoMeals = () => {
		autoMealRef.value.open()
	}
	const toRech = () => {
		mnavTo('/pages/user/recharge/recharge?cardId=' + orderDetials.value.sxpDdx?.card_no)

	}
</script>

<style lang="scss" scoped>
	.paddingBpNo {
		padding-bottom: 10rpx !important;
	}

	.splicing-con {
		image {
			width: 76.328rpx;
			height: 76.328rpx;
			margin-left: -20rpx;
			border-radius: 50%;
		}
	}

	.order-number-btn {
		border-radius: 5px;
		border: 1px solid #E1E1E1;
		color: #999;
		font-feature-settings: 'clig' off, 'liga' off;
		font-family: "Microsoft YaHei UI";
		font-size: 24rpx;
		font-style: normal;
		padding: 4rpx 20rpx;
		font-weight: 400;
		line-height: 150%;
		/* 18px */
		margin-left: 20rpx;
		width: 100rpx;
	}

	.text-over {
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		width: 450rpx;
		font-size: 32rpx;
	}

	.font-sizieStyle {
		font-size: 32rpx;
		margin-top: 10rpx;
	}

	.expanded {
		transform: translateY(0);
		/* 展开时的位移 */
	}

	.collapsed {
		transform: translateY(-100%);
		/* 收缩时的位移，向上移动100% */
	}

	.color33 {
		color: #333 !important;
	}

	.font-w {
		font-weight: 700;
	}

	.color99 {
		color: #999 !important;
	}

	.morview {
		padding: 40rpx 20rpx 40rpx 40rpx;
	}

	.order-footer {
		width: 100%;
		height: 130.882rpx;
		flex-shrink: 0;
		background: #FFF;
		box-shadow: 0px -12px 8.9px 0px rgba(0, 0, 0, 0.10);
		display: flex;
		justify-content: space-between;
		align-items: center;
		// padding: 0 40rpx;
		position: fixed;
		bottom: 0;
		z-index: 101;

		.activeShow {
			transform: scale(1) !important;
		}

		// .order-footer-menu {
		// 	.active {
		// 		background: rgba(76, 162, 123, 0.10);
		// 		color: rgba(76, 162, 123, 0.85);
		// 	}

		// 	text {
		// 		width: 127.504rpx;
		// 		height: 64.938rpx;
		// 		transition: .5s all;
		// 		justify-content: center;
		// 		display: flex;
		// 		align-items: center;
		// 		font-size: 28rpx;
		// 	}
		// }

		.order-footer-l {
			color: #666;
			// font-feature-settings: 'clig' off, 'liga' off;
			// font-family: "Microsoft YaHei UI";
			font-size: 16px;
			// font-style: normal;
			// font-weight: 400;
			// line-height: 150%;
			/* 24px */
			height: 100%;

			.zxkf {
				padding: 0 20rpx;
				background-color: #E2F3EA;
				height: 100%;

				.fcon-zhuanshukefu {
					font-size: 50rpx;
					color: #53A87F;
					margin-bottom: 8rpx;
				}

				.zxkf-font {
					color: #53A87F;
					text-align: center;
					font-family: "Microsoft YaHei UI";
					font-size: 14px;
					font-style: normal;
					font-weight: 400;
					line-height: normal;
				}
			}
		}

		.order-footer-r {
			display: flex;

			.cancel-btn {
				margin-left: 20rpx;
			}

			.pay-btn {
				margin-left: 20rpx;
				background-color: #53A87F;
				color: #fff;
			}

			.toEval {
				margin-left: 20rpx;
				height: 80rpx;
				flex-shrink: 0;
				border-radius: 36px;
				display: flex;
				padding: 0 35rpx;
				align-items: center;
				font-size: 28rpx;
				color: #53A87F;

				&:after {
					border: 4rpx solid #53A87F;
				}
			}

			text {
				height: 80rpx;
				flex-shrink: 0;
				border-radius: 36px;
				border: 1px solid #999;
				display: flex;
				justify-content: center;
				padding: 0 35rpx;
				align-items: center;
				color: #999;
				font-family: "Microsoft YaHei UI";
				font-size: 14px;
				font-style: normal;
				font-weight: 400;
				line-height: normal;

			}
		}
	}

	.order-address {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 20rpx 0;

		&.start {
			align-items: start;
		}

		.order-address-font {
			color: #333 !important;
			font-size: 32rpx;
			font-style: normal;
			font-weight: 400 !important;
			line-height: 150%;
			min-width: 130rpx;
			/* 24px */
			// font-family: "Microsoft YaHei UI";
		}

		.order-address-fonts {
			color: #333 !important;
			font-size: 32rpx;
			font-style: normal;
			font-weight: 400 !important;
			line-height: 150%;
		}

		.flex-col {
			display: flex;
			align-items: center;
		}

		.text-over-zs {
			color: #53A87F;
			font-family: "Microsoft YaHei UI";
			font-size: 28rpx;
			font-style: normal;
			font-weight: 700;
			line-height: normal;
			margin: 0 10rpx;
		}

		.order-address-r {
			display: flex;
			flex-direction: column;
			text-align: right;
		}
	}

	.menu-child {
		margin-top: 20rpx;

		.menu-child-ul {
			display: flex;
			justify-content: space-between;
			color: #333;
			font-feature-settings: 'clig' off, 'liga' off;
			font-family: "Microsoft YaHei UI";
			font-size: 16px;
			font-style: normal;
			font-weight: 400;
			margin-bottom: 20rpx;
		}
	}

	.color-red {
		color: #F00;
	}

	.launch {
		text-align: center;
		color: #999;
		font-feature-settings: 'clig' off, 'liga' off;
		font-family: "Microsoft YaHei UI";
		font-size: 14px;
		font-style: normal;
		font-weight: 400;
		padding: 20rpx 0;
		transition: all .5s;
	}

	.launchHeat {
		padding: 30rpx 0 0 0;
	}

	.fontHeat {
		font-size: 24rpx !important;
	}

	.rotateStyle {
		transform: rotate(90deg);
		display: inline-block;
		font-size: 18rpx;
	}

	.routerHover {
		transform: rotate(-90deg);
	}

	.or-padding-xs {
		padding: 0 20rpx;
	}

	.con-li-menu-container {
		// display: flex;
		// justify-content: space-between;
		margin-top: 20rpx;

		.con-li-menu-containerR {
			display: flex;
			flex-direction: column;
			text-align: right;
			justify-content: space-between;
		}

		.con-li-menu-containerL {
			display: flex;

			.con-li-menu-name {
				width: 500rpx;

				.menu_name_baseinfo {
					display: flex;
					justify-content: space-between;
					align-items: center;
					padding: 0 0 0 20rpx;
				}

				.shopTags {
					width: 100%;
					min-height: 40rpx;
					display: flex;
					justify-content: flex-start;
					align-items: center;
					flex-wrap: wrap;

					.tags_item {
						min-width: 88rpx;
						height: 44rpx;
						border-radius: 10rpx;
						background: rgba(235, 239, 251, 0.50);
						color: #999;
						font-size: 28rpx;
						font-weight: 400;
						text-align: center;
						line-height: 44rpx;
						padding: 0 20rpx 0 20rpx;
						margin-top: 15rpx;
						margin-left: 15rpx;
					}
				}

				.con-li-menuName {
					color: #000;
					font-size: 32rpx;
					font-weight: 400;
					max-width: 400rpx;
					overflow: hidden;
				}

				.con-li-menuNum {
					color: #999;
					font-size: 28rpx;
					font-weight: 400;
				}

				.con-li-menuNames {
					color: #999;
					font-size: 28rpx;
					font-weight: 400;
					text-decoration: line-through;
				}

				.con-li-menuPic {
					color: #333;
					font-size: 28rpx;
					font-weight: 700;
				}

				.con-li-menuCalorie {
					color: #333;
					font-size: 28rpx;
					font-weight: 400;
				}
			}

			.img-con {
				width: 120rpx;
				height: 120rpx;
				border-radius: 10rpx;

				.img {
					width: 120rpx;
					height: 120rpx;
					border-radius: 10rpx;
				}

				margin-right: 10rpx;
			}

		}
	}

	.order-details-col2 {
		.heat-con-bg {
			padding-bottom: 20rpx;
			display: flex;
			flex-direction: column;

			.paddingTops {
				padding: 34rpx 0;
			}

			.heat-con-ul {
				display: flex;
				width: 100%;
				border-bottom: 1px solid #F3F3F3;

				.text-width {
					min-width: 48rpx;
					// text-align: left;
				}

				.colorStyle {
					color: #999;
					font-family: "Microsoft YaHei UI";
					font-size: 28rpx;
					font-style: normal;
					font-weight: 400;
					line-height: normal;
				}

				.imgHeat-con {
					image {
						width: 28rpx;
						height: 28rpx;
						// margin-left: ;
					}
				}

				.ul_widd {
					width: 33.33%;
					color: #333;
					font-family: "Microsoft YaHei UI";
					font-size: 28rpx;
					font-style: normal;
					font-weight: 400;
					line-height: normal;
					text-align: center;

					&:nth-child(1) {
						text-align: left !important;
						padding-left: 10rpx;
					}
				}
			}

			.heat-con-title {
				border-radius: 20rpx;
				padding: 20rpx 0;
				background: #F5F6FA;

				text {
					color: #6B717E;
				}
			}
		}

		.order-d-heat-ul {
			display: flex;
			justify-content: space-between;
			padding-top: 20rpx;
		}

		.order-d-heat {
			width: 25%;

			&:nth-child(n+2) {
				margin-left: 25rpx;
			}

			.order-d-heat-ts {
				color: #6B717E;
				font-family: "Microsoft YaHei UI";
				font-size: 24rpx;
				font-style: normal;
				font-weight: 400;
				line-height: normal;
			}

			.order-d-heat-rl {
				color: #B0AEBB;
				font-family: "Microsoft YaHei UI";
				font-size: 24rpx;
				font-style: normal;
				font-weight: 400;
				line-height: normal;
			}

			.order-d-g-w {
				width: 100%;
				margin: 11rpx 0;
			}
		}

		.order-d-title {
			display: flex;
			justify-content: space-between;
			align-items: center;
			border-bottom: 1px solid #F8F8F8;
			padding-bottom: 20rpx;

			.order-d-titleL {
				color: #53A87F;
				font-feature-settings: 'clig' off, 'liga' off;
				font-family: "Microsoft YaHei UI";
				font-size: 16px;
				font-style: normal;
				font-weight: 700;
				line-height: 150%;
				/* 24px */
			}

			.order-d-titleR {
				color: #333;
				font-family: "Microsoft YaHei UI";
				letter-spacing: 1px;
				font-size: 14px;
				font-style: normal;
				font-weight: 400;
				line-height: normal;
			}
		}
	}

	.order-details-con {
		.order-d-yd {
			color: #999;
			font-family: "Microsoft YaHei UI";
			font-size: 14px;
			font-style: normal;
			font-weight: 400;
			line-height: normal;
			margin-bottom: 20rpx;
		}

		.order-details-business {
			display: flex;
			justify-content: space-between;
			position: relative;

			&::after {
				content: '';
				width: 2rpx;
				height: 150rpx;
				// opacity: 0.2;
				// background: linear-gradient(90deg, #FFF 0%, #313131 47.9%, #FFF 100%);
				position: absolute;
				opacity: 0.5;
				background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, rgba(133, 133, 133, 0.46) 46.5%, rgba(0, 0, 0, 0.00) 88.58%);
				left: 50%;
				top: 50%;
				transform: translate(-50%, -50%);
				z-index: 222;
			}

			.order-details-businessFlex {
				width: 45%;
				display: flex;
				justify-content: center;
				align-items: center;
				flex-direction: column;
				padding: 20rpx 0 0 0;

				.fcon-style {
					font-size: 40rpx;
				}

				.fcon-size {
					margin-top: 10rpx;
				}
			}
		}

		.order-details-conT {
			color: #333;
			font-family: "Microsoft YaHei UI";
			font-size: 16px;
			font-style: normal;
			font-weight: 400;
			line-height: normal;
			margin-bottom: 8.6rpx;
		}
	}

	.con {
		border-radius: 10px;
		background: #FFF;
		padding: 20rpx;
		margin-bottom: 20rpx;
	}

	.bgFix {
		position: absolute;
		width: 100vw;
		height: 100vh;
		left: 0;
		top: 0;
		z-index: 6;
		opacity: 1;
		background-color: linear-gradient(171deg, rgba(190, 207, 255, 0.50) 4.01%, rgba(248, 248, 250, 0.50) 78.06%);
		background-image: url('https://cdn-static.yekjx.com/food/images/cod_bg01.png');
		background-repeat: no-repeat;
		transition: opacity 0.5s ease-out;

		&.scrt {
			opacity: 0;
			z-index: 1;
		}
	}

	.scrbg {
		width: calc(100vw - 40rpx);
		height: 100%;
		position: absolute;
		left: 20rpx;
		top: 0;
		z-index: 1;
		border-radius: 20rpx 20rpx 0px 0px;
		transition: all 0.5s ease-out;
		background: linear-gradient(171deg, rgba(190, 207, 255, 0.80) 4.01%, rgba(248, 248, 250, 0.80) 78.06%);
		opacity: 0;

		&.bg {
			opacity: 1;
		}
	}

	.order-details {
		width: calc(100vw - 40rpx);
		border-radius: 20rpx 20rpx 0px 0px;
		padding: 0 20rpx 300rpx 20rpx;
		margin: auto;
		z-index: 3;
		// background: linear-gradient(171deg, rgba(190, 207, 255, 0) 4.01%, rgba(248, 248, 250, 0) 78.06%);


		.order-details-title {
			padding: 20rpx;

			.cuIcon-right-size {
				font-size: 30rpx;
			}

			.left-color {
				color: #333;
				font-family: "Microsoft YaHei UI";
				font-size: 20px;
				font-style: normal;
				font-weight: 700;
				line-height: normal;
			}
		}
	}

	.header {
		height: 162.2rpx;
		width: 750rpx;
		display: flex;
		position: fixed;
		top: 0;
		z-index: 2222;

		.cuIcon-size {
			font-size: 40rpx;
			padding-left: 20rpx;
		}

		.h-black {}
	}

	#bgMap {
		width: 100%;
		height: 100vh;
		position: relative;
	}

	.customCallout {
		font-size: 32rpx;
		color: #333;
		height: 100rpx;

		.callNames {
			min-width: 150rpx;
			max-width: fit-content !important;
			height: 80rpx;
			background: #FFF;
			border-radius: 80rpx;
			// padding:20rpx;
			// padding: 0 20rpx;
			line-height: 81rpx;
			text-align: center;
			// display: flex;
			// justify-content: center;
			box-shadow: 0px 10rpx 10px 0px rgba(34, 43, 69, 0.15);
			white-space: nowrap;
		}

		.coverImgs {
			width: 50rpx;
			height: 30rpx;
			margin: -13rpx auto;
		}
	}

	// .remakesss {
	//   width: calc(100vw - 200rpx);
	// }

	.order-details-tips {
		width: 100%;
		min-height: 82rpx;
		border-radius: 20rpx;
		background: #FFF;
		margin-bottom: 20rpx;
		display: flex;
		align-items: center;
		color: #333;
		font-size: 28rpx;
		font-weight: 400;
		padding: 10rpx 20rpx 10rpx 20rpx;
	}

	.yd_titles {
		color: #333;
		font-size: 32rpx;
		font-weight: 400;
	}

	.yd_times_text {
		color: #333;
		font-size: 56rpx;
		font-weight: 700;
		margin-top: 20rpx;
	}

	.order-details-businessFlex {
		width: 45%;
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
		margin-top: 30rpx;
		padding: 20rpx 0 0 0;

		.fcon-style {
			font-size: 40rpx;
		}

		.fcon-size {
			margin-top: 10rpx;
		}
	}

	.getMen_text {
		color: #999;
		font-size: 28rpx;
		font-weight: 400;
		text-align: center;
	}

	.genMen_nums {
		color: #333;
		font-size: 80rpx;
		font-weight: 400;
		text-align: center;
	}

	.genMen_times {
		color: #333;
		font-size: 32rpx;
		font-weight: 400;
		text-align: center;
		margin-top: 20rpx;
	}

	.reflash_ico {
		width: 50rpx;
		height: 50rpx;
		margin-right: 230rpx;
		display: flex;
		align-items: center;
		justify-content: center;

		.reflash_Ims {
			width: 100%;
			height: 100%;
		}
	}

	.imgEmpty {
		width: 100vw;
		height: 100vh;
	}

	.morbox {
		position: absolute;
		width: 240rpx;
		height: 0; //128rpx  158rpx
		line-height: 64rpx;
		left: -98rpx;
		bottom: 72rpx;
		z-index: 3;
		padding: 0;
		overflow: hidden;
		padding: 0 20rpx 0 20rpx;
		// transform-origin: left bottom;

		&.show {
			height: auto;
			transition: height 0.1s ease-out;
		}

		&.down {
			transform-origin: center top;

		}

		.mctbox {
			border-radius: 2px 2px 4px 4px;
			// height: 128rpx;//128rpx
			padding: 40rpx 0;
			box-shadow: 0px 3rpx 6rpx -4rpx rgba(0, 0, 0, 0.12), 0px 6rpx 12rpx 0px rgba(0, 0, 0, 0.08), 0px 9rpx 20rpx 8rpx rgba(0, 0, 0, 0.05);
		}

		.act {
			background: rgba(76, 162, 123, 0.10);
			color: rgba(76, 162, 123, 0.85);
		}

	}

	.sanjiao {
		position: relative;

		&.up {
			&:before {
				border-top: none;
				top: -16rpx;
				border-bottom-color: #fff;
			}
		}

		&:before {
			content: '';
			position: absolute;
			width: 0;
			height: 0;
			align-self: center;
			position: absolute;
			border: 16rpx solid transparent;
			bottom: -16rpx;
			left: 28rpx;
			border-bottom: none;

			border-top-color: #fff;
			z-index: 1;
		}

	}

	.mpitm:nth-child(n+2) {
		margin-top: 10rpx;
	}

	.margin-top-minx {
		margin-top: 8rpx;
	}

	.mutil_box {
		width: 100%;
		min-height: 100rpx;
		border-radius: 10rpx;
		background: #FAFAFA;
		margin-top: 20rpx;
		position: relative;
		padding: 20rpx;

		.mutilbox_item {
			&:nth-child(n+2) {
				margin-top: 15rpx;
			}

			.shopTags {
				width: 100%;
				min-height: 40rpx;
				display: flex;
				justify-content: flex-start;
				align-items: center;
				flex-wrap: wrap;

				.tags_item {
					height: 44rpx;
					border-radius: 10rpx;
					background: rgba(235, 239, 251, 0.50);
					color: #999;
					font-size: 28rpx;
					font-weight: 400;
					text-align: center;
					line-height: 44rpx;
					padding: 0 20rpx 0 20rpx;
					margin-top: 10rpx;
					margin-left: 10rpx;
				}
			}

			.con-li-subText {
				padding: 0 10rpx 0 10rpx;

				.con-li-subTextW {
					// min-width: 350rpx;
				}

				.con-li-submenu {
					width: 130rpx;
					text-align: right;
				}

				margin-bottom: 10rpx;
				display: flex;
				justify-content: space-between;
				align-items: center;
			}
		}

		&:before {
			content: '';
			position: absolute;
			width: 0;
			height: 0;
			align-self: center;
			position: absolute;
			border: 16rpx solid transparent;
			top: -16rpx;
			left: 45rpx;
			// margin-left: -20rpx;
			border-top: none;
			border-bottom-color: #FAFAFA;
			z-index: 1;
		}
	}

	.ques_icos {
		color: #D9D9D9;
		margin-left: 5rpx;
	}

	.dp_info {
		border-radius: 10rpx;
		background: rgba(235, 239, 251, 0.30);
		height: 80rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 0 15rpx;

		.info_tits {
			color: #333;
			font-size: 32rpx;
			font-weight: 400;
		}

		.tits_dpmin {
			color: #999;
			font-size: 24rpx;
			font-weight: 290;
		}

		.tits_dp_invs {
			color: #999;
			font-size: 32rpx;
			font-weight: 290;
			margin-left: 10rpx;
			margin-right: 10rpx;
		}

		.dp_normal {
			margin-left: 5rpx;
			font-size: 32rpx;
			color: #333;
			font-weight: 700;

			.dp_normal_minT {
				font-size: 20rpx;
			}
		}

		.dp_icons {
			margin-left: 5rpx;
		}

		.dp_act {
			color: #2CAC58;
		}
	}

	.dp_normal_items {
		display: flex;
		justify-content: space-between;
		margin-top: 20rpx;
		padding: 0 15rpx;

		.normal_text {
			color: #999;
			font-size: 32rpx;
			font-weight: 400;
		}

		.normal_time {
			color: #333;
			font-size: 32rpx;
			font-weight: 400;
		}
	}

	.detials_tk {
		color: #53A87F;
		margin-left: 10rpx;
	}

	.noBorder {
		border: none !important;
	}

	.text_greens {
		color: #2CAC58;
	}
</style>